{% extends "base-layout.html" %}
{% block head_title %}
    {{ super() }}
{% endblock %}
{% block head_seo %}
    {{ super() }}
{% endblock %}
{% block head_link %}
    {{ super() }}
    <link href="/static/libs/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
    <link href="/static/css/top-nav.css" rel="stylesheet" type="text/css" />
    <link href="/static/css/index.css" rel="stylesheet" type="text/css" />
{% endblock %}
{% block head_css %}
    {{ super() }}
{% endblock %}
{% block head_js %}
    {{ super() }}
{% endblock %}
{% block body_header %}
    {{ super() }}
    {% include "widgets/top-nav.html" ignore missing with context %}
{% endblock %}
{% block body_main %}
    <div class="container-fluid">
        <div class="row">
            <div class="col-xs-12 col-sm-8 col-md-9 col-lg-9 main-left-part">
                {# http://jinja.pocoo.org/docs/dev/templates/#if #}
                {% if (blog_list is defined) and (blog_list | length > 0) %}
                    <ul class="list-group blog-list-panel">
                        {# http://jinja.pocoo.org/docs/dev/templates/#list-of-control-structures #}
                        {% for blog_item in blog_list %}
                            <li class="list-group-item">
                                <h4 class="list-group-item-heading">
                                    <a href="{{ url_for('view_detail', blog_id=blog_item.id) }}">{{ blog_item.title }}</a>
                                    <small class="text-muted blog-category">
                                        [<a href="#">{{ blog_item.category }}</a>]
                                    </small>
                                    <span class="ico-btn-edit">
                                        <a href="{{ url_for('view_edit', id=blog_item.id, _suffix='/') }}" title="编辑">
                                            <i class="fa fa-pencil-square-o"></i>
                                        </a>
                                    </span>
                                </h4>
                                <p class="list-group-item-text">{{ blog_item.sketch }}</p>
                                <div class="list-group-item-footing">
                                    <div class="row">
                                        <div class="col-xs-12 col-sm-6">
                                            <span>{{ blog_item.tags }}</span>
                                        </div>
                                        <div class="col-xs-12 col-sm-6 text-right">
                                            <span class="text-muted">{{ blog_item.create_time[:19] }}</span>
                                        </div>
                                    </div>
                                </div>
                            </li>
                        {% endfor %}
                    </ul>
                    <div class="blog-list-pagination">
                        <nav aria-label="blog-list-pagination">
                            <ul class="pager">
                                <li class="previous disabled">
                                    <a href="#">
                                        <span aria-hidden="true">&larr;</span> Prev
                                    </a>
                                </li>
                                <li class="next">
                                    <a href="#">
                                        Next <span aria-hidden="true">&rarr;</span>
                                    </a>
                                </li>
                            </ul>
                        </nav>
                    </div>
                {% else %}
                    <div class="text-center">not data</div>
                {% endif %}
            </div>
            <div class="col-xs-12 col-sm-4 col-md-3 col-lg-2 main-right-part">
                <div class="panel panel-default tags-panel">
                  <div class="panel-heading">
                      <h3 class="panel-title">标签</h3>
                  </div>
                  <div class="panel-body">
                        <a href="#" class="tag-item">
                            <span class="tag-text">测试</span>
                            <span class="badge">42</span>
                        </a>
                        <a href="#" class="tag-item">
                            <span class="tag-text">test</span>
                            <span class="badge">12</span>
                        </a>
                        <a href="#" class="tag-item">
                            <span class="tag-text">hello world</span>
                            <span class="badge">9</span>
                        </a>
                  </div>
                </div>
            </div>
        </div>
    </div>
{% endblock %}
{% block body_footer %}
    {{ super() }}
{% endblock %}
{% block body_src %}
    {{ super() }}
{% endblock %}
{% block body_js %}
    <script type="text/javascript">
        $(document).ready(function() {
            ;
        });
    </script>
{% endblock %}